<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="keywords" content="土购网,电商,农产品" />
    <meta name="description" content="这是一个关于农产品的电商网站。" />
    <title>商品详情</title>
    <link rel="shortcut icon" href="../res/images/logo.png" type="image/png" />
    <!-- 引入样式文件 -->
    <!-- <link rel="stylesheet" href="./dist/css/app.css"> -->
    <link
      rel="stylesheet"
      href="../node_modules/_swiper@6.3.2@swiper/swiper-bundle.css"
    />
    <link rel="stylesheet/less" href="../style/reset.less" />
    <link rel="stylesheet/less" href="../style/app.less" />
    <link rel="stylesheet/less" href="../style/login.less" />
    <link rel="stylesheet/less" href="../style/nav.less" />
    <link rel="stylesheet/less" href="../style/category.less" />
    <link rel="stylesheet/less" href="../style/goods_details.less" />
    <!-- 引入编译less的文件 -->
    <script src="../node_modules/_less@3.12.2@less/dist/less.js"></script>
  </head>
  <body>
    <!-- 头部 -->
    <header>
      <!-- 顶部信息 -->
      <div class="top-nav">
        <div class="container clearfix">
          <ul class="left-nav left">
            <li><a href="../index.html">您好！欢迎来到土购网菜市场！</a></li>
            <li class="login" data-type="login">
              <a href="" data-type="login">请登录</a>
            </li>
            <li class="register" data-type="register">
              <a href="" data-type="register">免费注册</a>
            </li>
          </ul>
          <ul class="right-nav right">
            <li><a href="">购物车</a></li>
            <li>
              <a href="">服务热线：<span>8004001234</span></a>
            </li>
          </ul>
        </div>
      </div>
      <!-- 搜索 -->
        
      <div class="top-search-container">
        <div class="container clearfix">
          <!-- logo -->
          <a href="../index.html" class="left-icon left">
            <img src="../res/images/logo.png" alt="logo" />
          </a>
          <!-- 搜索 -->
          <div class="search left">
            <input type="search" />
            <button class="btnsearch">搜索</button>
          </div>
        </div>
      </div>
      <!-- 导航 -->
        
      <nav class="top_sub_nav_container">
        <div class="nav_container"></div>
      </nav>
      <!-- 轮播图 -->
      <nav class="top-banner-container">
        <div class="swiper-container">
          <div class="swiper-wrapper">
            <div class="swiper-slide">
              <img
                width="100%"
                height="400px"
                src="https://pic0.sucaisucai.com/05/31/05331260_2.jpg"
                alt="banner"
              />
            </div>
            <div class="swiper-slide">
              <img
                width="100%"
                height="400px"
                src="https://pic7.sucaisucai.com/07/85/07085467_2.jpg"
                alt="banner"
              />
            </div>
            <div class="swiper-slide">
              <img
                width="100%"
                height="400px"
                src="https://pic1.sucaisucai.com/09/63/09263571_2.jpg"
                alt="banner"
              />
            </div>
          </div>
          <!-- 如果需要分页器 -->
          <div class="swiper-pagination"></div>

          <!-- 如果需要导航按钮 -->
          <div class="swiper-button-prev"></div>
          <div class="swiper-button-next"></div>
          <!-- 分类导航 -->
          <div class="category-nav"></div>
        </div>
      </nav>
    </header>
    <!-- 主体部分 -->
    <main>
      <div class="goods-details clearfix">
        <div class="goods-img left"></div>
        <div class="goods-info left">
          <h2 class="title"></h2>
          <p>零售价:￥ <span class="price"></span></p>
          <button class="btnPay">立即购买</button>
        </div>
      </div>
    </main>
    <!-- 尾部 -->
    <footer>
      <div class="security">
        <ul class="wrap">
          <li><i class="i1"></i>土的自然 购得放心</li>
          <li><i class="i2"></i>买卖特产 全程服务</li>
          <li><i class="i3"></i>正品保障 精致生活</li>
          <li><i class="i4"></i>天天特价 特惠体验</li>
        </ul>
      </div>
      <div class="foot clearfix">
        <em class="left">
          <a href="http://union.xns315.com/lm/xns017341.html">
            <img
              src="http://www.tugoo.net/template/platform_default/new/images/xns315.gif"
              alt="中国农业网站共建联盟"
            />
          </a>
          <a href="http://www.tugoo.net/about.aspx?wd=zhengshu">
            <img
              src="http://www.tugoo.net/template/platform_default/new/images/baiqiang.gif"
              alt="中国农业百强网站"
            />
          </a>
          <a href="http://www.hao123.com/">
            <img
              src="http://www.hao123.com/static/images/public/logo.jpg"
              alt="hao123"
            />
          </a>
        </em>
        <p>
          <a href="http://www.tugoo.net/about.aspx?wd=about">关于我们</a>
          <a href="http://www.tugoo.net/about.aspx?wd=contact">联系我们</a>
          <a href="http://www.tugoo.net/about.aspx?wd=privacy">隐私声明</a>
          <a href="http://www.tugoo.net/about.aspx?wd=service">服务条款</a>
          <a href="http://www.tugoo.net/about.aspx?wd=job">招贤纳士</a>
          <a href="http://www.tugoo.net/login.aspx?url=/tenants.aspx"
            >商家入驻</a
          >
        </p>
        <p>
          增值电信业务经营许可证粤B2-2012052 粤ICP备12003095-2号
          Copyright&copy;2013-2022 版权所有 http://www.lovehou.com
        </p>
        <div style="width: 300px; margin: 0 auto; padding: 20px 0">
          <a
            target="_blank"
            href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=36070202000100"
            style="
              display: inline-block;
              text-decoration: none;
              height: 20px;
              line-height: 20px;
            "
            ><img
              src="http://www.tugoo.net/template/platform_default/new/images/beian.png"
              style="float: left"
            />
            <p
              style="
                float: left;
                height: 20px;
                line-height: 20px;
                margin: 0px 0px 0px 5px;
                color: #939393;
              "
            >
              粤公网安备 36070202000100号
            </p></a
          >
        </div>
      </div>
    </footer>
  </body>
  <script src="../node_modules/_jquery@3.5.1@jquery/dist/jquery.js"></script>
  <script src="../node_modules/_swiper@6.3.2@swiper/swiper-bundle.js"></script>
  <script src="../js/tools.js"></script>
  <script src="../js/app.js"></script>
</html>
